#include("header.html")

<div class="container">
    <div class="box box-warning">
        <div class="box-header">
            <h4 class="box-title"><span class="fa fa-plus-circle"></span>用户注册</h4>
        </div>
        <div class="box-body">
            #if(CanReg)
            <form method="post" class="form-horizontal">
                <div class="form-group">
                    <div  id="error" style="color: red;margin-left: 40%;margin-bottom: 2%;display: none;"></div>
                    <label for="username" class="control-label col-lg-2 col-sm-2 col-xs-4">账号</label>
                    <div class="col-lg-10 col-sm-10">
                        <input name="username" id="username" class="form-control" placeholder="请输入账号"
                               required onfocus="errorNone();">
                    </div>
                </div>
                <div class="form-group">
                    <label for="password" class="control-label col-lg-2 col-sm-2 col-xs-4">密码</label>
                    <div class="col-lg-10 col-sm-10">
                        <input name="password" id="password" class="form-control" placeholder="请输入密码" type="password"
                               required onfocus="errorNone();">
                    </div>
                </div>
                <div class="form-group">
                    <label for="password2" class="control-label col-lg-2 col-sm-2 col-xs-4">确认密码</label>
                    <div class="col-lg-10 col-sm-10">
                        <input id="password2" class="form-control" placeholder="再次输入密码" type="password" required onfocus="errorNone();">
                    </div>
                </div>
                <div class="form-group">
                    <label for="name" class="control-label col-lg-2 col-sm-2 col-xs-4">姓名</label>
                    <div class="col-lg-10 col-sm-10">
                        <input name="realName" id="name" class="form-control" placeholder="李某某" required onfocus="errorNone();">
                    </div>
                </div>
                <div class="form-group">
                    <label for="job" class="control-label col-lg-2 col-sm-2 col-xs-4" >职位</label>
                    <div class="col-lg-10 col-sm-10">
                        <select id="job" name="post" class="form-control">
                            <option value="2">教师</option>
                            <option value="1">学生</option>
                        </select>
                    </div>
                </div>
                <div class="form-group">
                    <label for="tel" class="control-label col-lg-2 col-sm-2 col-xs-4">手机号</label>
                    <div class="col-lg-10 col-sm-10">
                        <input name="tel" id="tel" class="form-control" placeholder="手机号（找回密码的凭证）" maxlength="11"
                               required onfocus="errorNone();">
                    </div>
                </div>
                <div class="form-group">
                    <label for="email" class="control-label col-lg-2 col-sm-2 col-xs-4">邮箱</label>
                    <div class="col-lg-10 col-sm-10">
                        <input name="email" id="email" class="form-control" placeholder="邮箱" required onfocus="errorNone();">
                    </div>
                </div>
                <!--<div class="form-group">-->
                <!--<label style="padding-top: 8px;" for="code" class="control-label text-danger col-lg-2 col-sm-2 col-xs-5">注册邀请码</label>-->
                <!--<div class="col-lg-10 col-sm-10 col-xs-7">-->
                <!--<input name="code" id="code" class="form-control" placeholder="请输入邀请码" type="text" required>-->
                <!--</div>-->
                <!--</div>-->
                <div class="form-group">
                    <div class="col-lg-12" style="margin-top: 5px;">
                        <button type="submit" class="btn btn-warning btn-block">注册</button>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-lg-6 col-xs-6">
                        <a href="/user/about" class="text-success"><i class="fa fa-info"></i> 关于我们</a>
                    </div>
                    <div class="col-lg-6 col-xs-6 text-right">
                        <a href="/user/login" class="text-black">马上登录 <span class="fa fa-sign-in"></span></a>
                    </div>
                </div>
            </form>
            #else
            <div class="text-center">
                <p class="alert alert-warning">用户注册功能已被关闭！</p>
            </div>
            #end
            #include("sign.html")
        </div>
    </div>
</div>

<script>
    $('form').submit(function (e) {
        var email = checkEmail();
        var phone = checkPhone();
        var pwd = checkPassword();
        var name = checkName();
        if(pwd==1&&phone==1&&email==1&&name==1){
            $.post('/user/register', $(this).serialize(), function (data) {
                if (data.success) {
                    alert('SUCCESS: 注册成功！即将跳转登录');
                    location.href = '/user/login'
                } else {
                    alert('ERROR: ' + data.msg);
                }
            });
        }
        e.preventDefault();

    });
    function checkName() {
        var flag = haveChinese($('#username').val());
        if($('#username').val().length<6){
            document.getElementById('error').innerText="用户名不能小于6位！";
            document.getElementById('error').style.display='block';
            return 0;
        }
        else if(flag == 0){
            document.getElementById('error').innerText="用户名不能存在中文！";
            document.getElementById('error').style.display='block';
            return 0;
        }
        else return 1;
    }
    function haveChinese(ob){
        if (escape(ob).indexOf( "%u" )>=0){
            return 0;
        }else return 1;
    }


    function checkPassword() {
        if($('#password').val().length<6){
            document.getElementById('error').innerText="密码不能小于6位！";
            document.getElementById('error').style.display='block';
            return 0;
        }
        else if(($('#password').val()!=$('#password2').val())||$('#password').val()==''||
            $('#password2').val()==''){
            document.getElementById('error').innerText="两次密码输入不一致！";
            document.getElementById('error').style.display='block';
            return 0;
        }
        else {
            return 1;
        }
    }
    function checkPhone() {
        var myreg=/^[1][3,4,5,7,8][0-9]{9}$/;
        if (!myreg.test($('#tel').val())) {
            document.getElementById('error').innerText="手机号输入不正确！";
            document.getElementById('error').style.display='block';
            return 0;
        } else {
            return 1;
        }
    }
    function checkEmail(){
        var reg = new RegExp("^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$"); //正则表达式
        var obj = document.getElementById("email"); //要验证的对象
        if(!reg.test(obj.value)){ //正则验证不通过，格式不对
            document.getElementById('error').innerText="邮箱输入不正确！";
            document.getElementById('error').style.display='block';
            return 0;
        }else{
            return 1;
        }
    }
    function errorNone(){
        document.getElementById('error').style.display='none';
    }
</script>

</body>
</html>
